<template>
    <div>
        <!--我的页面-->
        <div style="width: 100%;height: 180px;background-color: #30383F;">
            <div style="margin: 0 auto;width: 70px;text-align: center;padding-top: 50px;">
                <div>
                    <i style="font-size: 50px;color: white;" class="alicon icon-wode"></i>
                </div>
                <div style="color: white;" id="usn">{{userName}}</div>
                <div style="color: #FFFFFF;font-size: 12px;"></div>
            </div>
        </div>
        <div style="width: 100%;height: 7px;background-color: #f5f5f5;"></div>
        <ul class="mui-table-view">
            <router-link to="/my/myinfo">
                <li class="mui-table-view-cell">
                    <a >
                       	 我的资料
                    </a>
                    <i slot="icon" class="alicon icon-arrow" style="font-size: 16px;position:absolute;top: 11px;right: 16px;"></i>
                </li>
            </router-link>
            <router-link to="/my/ModifyPassword">
                <li class="mui-table-view-cell">
                    <a >
                        	修改密码
                    </a>
                    <i slot="icon" class="alicon icon-arrow" style="font-size: 16px;position:absolute;top: 11px;right: 16px;"></i>
                </li>
            </router-link>
        </ul>
        <div style="width:100%;padding-left: 10px;padding-right: 10px;margin-top:15px;">
            <mt-button type="primary" size="large" @click="loginout">退出</mt-button>
        </div>
    </div>
</template>

<script>
    import { MessageBox } from 'mint-ui';
    import { Toast } from 'mint-ui';
    import { mapState } from 'vuex'
    import axios from 'axios'
    import api from "@/components/js/Apidomain.js"
    import { setlocalstorage, setsessionstorage, removesessionstorage, removelocalstorage } from "@/components/js/Localstorage.js"
    export default {
        data() {

            return {
                //从后端拿什么

                roleId: '',
                userName: ''

                //                  classname:'',
                //                  userimg:''
            }
        },
        mounted() {
            this.init(); //页面初始化加载
        },
        methods: {
            init() {
                //				
                var roleId;
                var userName;
                this.roleId = sessionStorage.getItem('roleid');
                this.userName = sessionStorage.getItem('username');
                console.log(this.roleId)
                console.log(this.userName)

            },
            //          	
            loginout: function() {
                MessageBox({
                        title: '提示',
                        message: '确定要退出吗?',
                        showCancelButton: true,
                        confirmButtonText: "确定",
                        cancelButtonText: "取消"
                    }).then(action => {
                        if(action == 'confirm') {
//							console.log("555")
                            var self = this;
                            let url = api.apidomain + '/tqes/web/login/exit';
                            this.$http.post(url).then(function(response) {
                                console.log(response)
                                if(response.data.success == true) {
                                    removesessionstorage("token");
                                    removesessionstorage("authorization");
                                    removesessionstorage("role");
                                    removesessionstorage("roleid");
                                    removesessionstorage("topMenuInfo");
                                    removesessionstorage("userCode");
                                    removesessionstorage("username");
                                    removelocalstorage("token");
                                    self.$router.push('/login');

                                    Toast({
                                        message: "退出成功",
                                        position: 'middle',
                                        duration: 1000
                                    });
                                    console.log(1)     
                                } else if(response.data.success == false) {
                                    Toast({
                                        message: "response.data.msg",
                                        position: 'middle',
                                        duration: 1000
                                    });
                                }

                            })
                        } else {
                            return;
                        }
                    })
                    .catch(function(error) {
                        Toast
                            ({
                                message: '系统发生错误',
                                position: 'middle',
                                duration: 1000
                            });
                    });
            }
        }
    }
</script>
<style scoped>
    a {
        color: black !important;
    }
</style>